<!--
 * @Author: ryo
 * @Date: 2021-11-20 23:11:14
 * @LastEditors: ryo
 * @LastEditTime: 2021-11-25 14:08:46
 * @Description: 解决方案组件
 * @FilePath: \site\src\views\scheme\Home.vue
-->
<template>
  <div class="scheme">
    <!-- 轮播图 -->
    <m-carousel> </m-carousel>
    <!-- 解决方案 -->
    <v-container fluid class="mb-15 mt-10 box">
      <v-row justify="center" align="center">
        <v-col>
          <div class="box_title">
            <div class="h2">解决方案</div>
            <div class="caption">Solution</div>
          </div>
        </v-col>
      </v-row>
      <v-row justify="start" align="center">
        <v-col md="4" sm="6" cols="12" v-for="i in 7" :key="i">
          <v-card class="mx-auto" max-width="375">
            <v-img
              src="/images/product/01.png"
              max-width="375"
              class="align-center"
            >
              <v-card-title class="justify-center scheme_title">
                解决方案
              </v-card-title>
            </v-img>
          </v-card>
        </v-col>
      </v-row>
    </v-container>
  </div>
</template>

<script>
import mCarousel from '@/components/common/Carousel.vue';

export default {
  name: 'Scheme',
  components: {
    mCarousel
  }
};
</script>

<style lang="scss" scpoed>
.scheme {
  &_title {
    background-color: rgba(209, 23, 30, 0.5);
    color: white;
  }
}
</style>
